<template>
    <view class="definite">
     <u-navbar :is-back="true" title="账号信息" back-text="">
      <view
        class="slot-right"
        style="width: 100%; display: flex; justify-content: flex-end"
      >
        <view style="padding: 0rem 0.5rem;display: flex;
align-items: center;">
            <!-- <view style="
font-size: 0.75rem;
font-family: PingFang SC;
font-weight: 300;
color: #02AF74;" >员工规则</view> -->

            <!-- <image style="width: 0.7rem;
height: 0.5rem;
padding: 0.3rem;" src="../../../style/image/my/bottomArrow.jpg" alt=""> -->
        </view>
      </view>
    </u-navbar>
         <view @click="goModify(info.nickName)"  class="item">
      <span>昵称</span>
       <span>
      <span style="color:#666666;">{{info.nickName==null?'暂未设置':info.nickName}}</span>
        <image class="image" src="../../style/image/cargo/back.png" alt="">
      </span>
    </view>
    <view class="item">
      <span>登陆账户</span>
      <span style="color:#666666;">{{info.phone==null?'暂未设置':info.phone}}</span>
    </view>
     <view class="item">
      <span>真实姓名</span>
      <span style="color:#666666;">{{info.realName==null?'暂未设置':info.realName}}</span>
    </view>
     <view class="item">
      <span>推荐码</span>
      <span style="color:#666666;">{{info.recCode==null?'暂无':info.recCode}}</span>
    </view>
     <view class="item">
      <span>注册时间</span>
      <span style="color:#666666;">{{info.registTime==null?'暂无':info.registTime}}</span>
    </view>
    <view class="item-one">
      <span>实名信息</span>
      <!-- <image class="image" src="../../style/image/my/A34.png" alt=""> -->
    </view>
     <view class="item">
      <span>身份证号码</span>
      <span style="color:#666666;">{{identify==null?'暂无':identify}}</span>
    </view>
     <view class="item">
      <span>收款支付宝账号</span>
      <span style="color:#666666;">{{info.appily==null?'暂无':info.appily}}</span>
    </view>
    </view>
</template>

<script lang='ts' >
import { Component, Prop, Vue, Watch, Emit } from "vue-property-decorator";

import { findUserInfo, uploadApi, saveUserInfo } from "../../utils/uniApi";
import uNavbar from "@/uview-ui/components/u-navbar/u-navbar.vue";
@Component({
  //   @Component  是一个装修器   不可以在下面写语句
  name: "test",
  components: {
    "u-navbar": uNavbar,
  },
})
export default class extends Vue {
  @Prop({
    type: String, // 父组件传递给子组件的数据类型
    required: false, // 是否必填
    default: " ", // 默认值， 如果传入的是 Object，则要 default: ()=>({}) 参数为函数
  })
  msg!: string;

  public info = {
    id: "",
    parentId: "", //上级用户ID
    parentPhone: "", //	父级账号（拥有该字段的人代表是子账号）
    pwd: "", //	密码
    payPwd: "", //	支付密码
    roleId: "", //	角色
    roleEndTime: "", //	会员到期时间
    phone: "", //手机号
    card: "", //证件号
    realName: "", //真实姓名
    registTime: "", //	注册时间
    blackAccountName: "", //支付宝用户名（姓名）
    blackNum: "", //	支付宝账号
    headImg: "", //	头像
    nickInitial: "", //	昵称首字母
    nickName: "HIPPY", //	昵称
    oId: "", //	所属品牌
    remarks: "", //余额
    count: "", //推荐人数
    clientid: "", //设备ID
    recCode: "", //推荐码
    blance: "", //余额
    supportStaffQq: "", //	客服QQ
    supportStaffPhone: "", //客服电话
    role: {
      roleName: "暂未设置会员等级", //会员名称
    }, //会员信息
  };

  public identify = "";
  public appily = "";

  created() {}

  mounted() {
    uni.showLoading({
      title: "加载中",
    });
    //     var card='123845785238542307';
    // var strcard=card.replace(/^(.{4})(?:\d+)(.{4})$/,"$1******$2");
    this.findUserInfoM();
  }

    onPullDownRefresh() {
    console.log("refresh");

    setTimeout(function () {
      uni.redirectTo({
        url: "../../pages/my/accountInfo",
      });
      uni.stopPullDownRefresh();
    }, 1000);
    
  }

  findUserInfoM() {
    let params = {
      userId:
        uni.getStorageSync("userId") == ""
          ? ""
          : parseInt(uni.getStorageSync("userId")),
    };
    findUserInfo(params).then((res: any) => {
      console.log("个人信息res", res);
      this.info = res.data.data;

      this.identify = res.data.data.card;

      this.identify = this.identify.replace(
        /^(.{4})(?:\d+)(.{4})$/,
        "$1******$2"
      );

      this.appily = res.data.data.blackNum;

      console.log(this.identify, "this.identify", this.appily);

      // this.src = res.data.data.headImg;
      uni.hideLoading();
    });
  }

  goModify(data: any) {
    uni.navigateTo({
      url: `../../pages/my/name?name=${data}`,
    });
  }
}
</script>

<style  scoped>
.definite {
  font-family: PingFang SC;
  background: #f3f5f7;
  height: 100%;
}
uni-page-body {
  height: 100%;
}
.item {
  padding: 0.7rem;
  line-height: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.75rem;
  font-family: PingFang SC;
  font-weight: 400;
  color: #000000;
  background: #ffffff;
  border-top: 0.08rem #f3f5f7 solid;
  border-bottom: 0.08rem #f3f5f7 solid;
}
.item-one {
  padding: 0.5rem 0.7rem;
  line-height: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.6rem;
  font-family: PingFang SC;
  font-weight: 300;
  color: #666666;
}
.image {
  width: 0.3rem;
  height: 0.57rem;
  padding-left: 0.5rem;
}
.image {
  width: 0.35rem;
  height: 0.58rem;
}
</style>